<template>
	<view>
		<view class="lan_text bold textcenter" style="padding-top: 180rpx; font-size: 60rpx;">登录</view>
		<input type="password" style='width:0;height:0;min-height:0' />
		<input type="text" autocomplete="off" style='width:0;height:0;min-height:0' />
		<view class="mainpadding">
			<view class="mainpadding">
				<view class="pdl">
					<input type="text" autocomplete="off" class="hei_text main_size bold" placeholder="请输入账号"
						v-model="account">
				</view>
				<view class="pdl margin_top6">
					<input type="password" autocomplete="off" class="hei_text main_size bold" placeholder="请输入密码"
						v-model="password">
				</view>
			</view>
			<!-- <view class="flexbetween">
				<view class="xiaohui margin_top" @click="jumpurl('/pages/login/codelogin')">验证码登录</view>
				<view class="xiaohui margin_top" @click="jumpurl('/pages/login/signin')">还没账号，点击注册</view>
			</view> -->
		</view>
		<view class="flexcenter margin_top" style="padding: 0 60rpx;" @click="checkaudio">
			<view class="nocheckaudio" v-show="!type"></view>
			<view class="checkaudio" v-show="type"></view>
			<view class="xiaohui margin_left1">
				阅读并同意
				<text class="xiaolan" @click.stop="jumpurl('/pages/system/system?type=1')">《用户协议》</text>
				和
				<text class="xiaolan" @click.stop="jumpurl('/pages/system/system?type=2')">《隐私政策》</text>
			</view>
		</view>
		<view class="mainpadding">
			<view class="mainpadding">
				<view class="submitbtn" @click="login()" v-if="!liandiantype">登录</view>
				<view class="submitbtn" v-if="liandiantype">登录</view>
				<!-- <view class="margin_top5 xiaohui flexcenter" @click="jumpurl('/pages/login/wangjimm')">忘记密码</view> -->
			</view>
		</view>
		<!-- <view class="wave wave1"></view>
		<view class="wave wave2"></view>
		<view class="wave wave3"></view> -->
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				account: "",
				type:false,
				password:"",
				liandiantype:0
			}
		},
		methods: {
			jumpurl(url) {
				uni.navigateTo({
					url
				})
			},
			checkaudio(){
				this.type = !this.type
			},
			login(){
				let _this = this;
				if(_this.account == ''){
					httpRequest.toast("请输入账号!")
					return;
				}
				if(this.password==""){
					httpRequest.toast("请输入密码")
					return false
				} 
				if(!this.type){
					httpRequest.toast("请认真阅读并勾选用户协议");
					return false;
				}
				this.liandiantype = 1
				uni.showLoading({
					mask:true,
					title:"请稍候"
				})
				httpRequest.request('/api1/user/login','GET',{
					account:this.account, 
					password:this.password
				}).then(res => {
					if(res.code == 1){
						uni.hideLoading()
						httpRequest.toast('登录成功');
						uni.setStorageSync('token',res.data.userinfo.token);
						uni.setStorageSync('user_id',res.data.userinfo.user_id);
						setTimeout(()=>{
							uni.reLaunch({
								url:"/pages/index/index"
							})
						},1000)
					}else{
						this.liandiantype = 0
						uni.hideLoading()
						httpRequest.toast(res.msg);
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.wave {
		position: fixed;
		left: 0;
		bottom: 0px;
		width: 200%;
		height: 100px;
		background-repeat: repeat-x;
		background-position: left bottom;
		transform-origin: center bottom;
		background-size: 50% 90px;
	}

	// .wave1 {
	// 	z-index: 5;
	// 	opacity: 1;
	// 	animation: swave 20s linear infinite;
	// 	background-image: url("../../static/image/system/bolang.png");
	// }

	// .wave2 {
	// 	z-index: 4;
	// 	opacity: .3;
	// 	animation: swave 30s linear infinite;
	// 	background-image: url("../../static/image/system/bolang.png");
	// }

	// .wave3 {
	// 	z-index: 3;
	// 	opacity: .5;
	// 	animation: swave 45s linear infinite;
	// 	background-image: url("../../static/image/system/bolang.png");
	// }

	@keyframes swave {
		0% {
			transform: translateX(0) scaleY(1)
		}

		50% {
			transform: translateX(-25%) scaleY(.55)
		}

		100% {
			transform: translateX(-50%) scaleY(1)
		}
	}
</style>